/*
 * @Author: taoyuqing
 * @Date: 2022-12-24 14:47:11
 * @Description: 抽屉内容
 */
import 'package:flutter/material.dart';
import 'package:flutter_svg/svg.dart';
import 'package:spree/utils/utils.dart';

import 'drawer_select_menu.dart';

class DrawerContent extends StatefulWidget {
  final Function? onItemTap;
  DrawerContent({Key? key, this.onItemTap}) : super(key: key);

  @override
  State<DrawerContent> createState() => _DrawerContentState();
}

class _DrawerContentState extends State<DrawerContent> {
  final List _languages = [
    {'label': 'English', 'value': 'en'},
    {'label': '简体中文', 'value': 'cn'}
  ];
  String _selectLan = 'English';

  @override
  Widget build(BuildContext context) {
    return Container(
      padding: EdgeInsets.only(
          top: Utils().getAppStatusBarHeight(context),
          left: 15,
          right: 15,
          bottom: 5),
      child: ListView(
        padding: EdgeInsets.zero,
        children: [
          Column(
            children: [
              Container(
                margin: const EdgeInsets.only(bottom: 30),
                child: SvgPicture.asset(
                  'images/BETSPREELOGO.svg',
                  height: 40,
                ),
              ),
              Container(
                margin: const EdgeInsets.only(bottom: 15),
                child: Image.asset('images/drawer1.png'),
              ),
              Container(
                margin: const EdgeInsets.only(bottom: 15),
                child: Image.asset('images/drawer2.png'),
              )
            ],
          ),
          drawerDivider(),
          Container(
            margin: const EdgeInsets.only(top: 20),
            child: drawerMenu('images/drawer-icon1.png', 'Slots'),
          ),
          GestureDetector(
            onTap: () {
              if (widget.onItemTap != null) {
                widget.onItemTap!('live');
              }
            },
            child: Container(
              margin: const EdgeInsets.only(top: 20),
              child: drawerMenu('images/drawer-icon2.png', 'Live Casino'),
            ),
          ),
          GestureDetector(
            onTap: () {
              if (widget.onItemTap != null) {
                widget.onItemTap!('games');
              }
            },
            child: Container(
              margin: const EdgeInsets.only(top: 20, bottom: 15),
              child: drawerMenu('images/drawer-icon3.png', 'Games'),
            ),
          ),
          drawerDivider(),
          Container(
            margin: const EdgeInsets.only(top: 20),
            child: drawerMenu('images/drawer-icon4.png', 'VIP Rank System'),
          ),
          Container(
            margin: const EdgeInsets.only(top: 20),
            child: drawerMenu('images/drawer-icon5.png', 'Promotions'),
          ),
          Container(
            margin: const EdgeInsets.only(top: 20, bottom: 15),
            child: drawerMenu('images/drawer-icon6.png', 'Bonuses'),
          ),
          drawerDivider(),
          Container(
            margin: const EdgeInsets.only(top: 20),
            child: drawerMenu('images/drawer-icon7.png', 'Affiliates'),
          ),
          Container(
            margin: const EdgeInsets.only(top: 20, bottom: 15),
            child: drawerMenu('images/drawer-icon8.png', 'Fairness'),
          ),
          drawerDivider(),
          Container(
            margin: const EdgeInsets.only(top: 20),
            child: DrawerSelectMenu(
              imgPath: 'images/drawer-menu-icon1.png',
              name: 'Live Support',
            ),
          ),
          Container(
            margin: const EdgeInsets.only(top: 15),
            child: DrawerSelectMenu(
              imgPath: 'images/drawer-menu-icon2.png',
              name: _selectLan,
              child: PopupMenuButton(
                icon: const Icon(
                  Icons.expand_more,
                  color: Color(0xFFB0AFEC),
                ),
                itemBuilder: (context) {
                  return _languages.map((e) {
                    return PopupMenuItem<dynamic>(
                      value: e,
                      child: Text(e['label']),
                    );
                  }).toList();
                },
                onSelected: (value) {
                  setState(() {
                    print(value['label']);
                    _selectLan = value['label'];
                  });
                },
              ),
            ),
          ),
          Container(
            margin: EdgeInsets.only(top: 15),
            child: Wrap(
              alignment: WrapAlignment.center,
              spacing: 8,
              children: [
                shareIcon('images/share1.png'),
                shareIcon('images/share2.png'),
                shareIcon('images/share3.png'),
                shareIcon('images/share4.png')
              ],
            ),
          )
        ],
      ),
    );
  }

  Widget shareIcon(String imgPath) {
    return Image.asset(
      imgPath,
      width: 30,
      height: 30,
    );
  }

  Widget drawerDivider() {
    return const Divider(
      height: 1,
      color: Color(0xFF8B8AD1),
    );
  }

  Widget drawerMenu(String imgPath, String name) {
    return Row(
      children: [
        Container(
          width: 30,
          height: 30,
          margin: EdgeInsets.only(right: 10),
          child: Image.asset(imgPath),
        ),
        Text(
          name,
          style: TextStyle(color: Color(0xFFB0AFEC)),
        )
      ],
    );
  }
}
